#home-container {
  background-color: #e2e2e2;
  .home-header {
    display: flex;
    align-items: center;
    // background-color: transparent;
    .home-header-searchbar {
      flex: 1;
      background-color: transparent;
    }
  }
  .banner-list {
    margin: 0.625rem 0.3125rem 0 0.3125rem;
    border-radius: 0.625rem;
    overflow: hidden;
    .banner-item {
      .banner-item-img {
        width: 100%;
        height: 100%;
      }
    }
  }
  .drawer {
    .at-drawer__content {
      padding: 10px;
      .drawer-item {
        display: flex;
        padding-bottom: 0.3125rem;
        border-bottom: 1px solid #ccc;
      }
      .user-box {
        justify-content: space-around;
        align-items: center;
      }
    }
  }
  .handle_list {
    overflow: hidden;
    margin-top: 40px;
    margin-left: 20px;
    margin-right: 20px;
    padding: 10px 40px;
    border-radius: 20px;
    background-color: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    .handle_list__item {
      margin-top: 20px;
      flex: 1;
      width: 20%;
      width: calc((100% - 60px) / 4);
      // 这里的60px = (分布个数4-1)*间隙20px, 可以根据实际的分布个数和间隙区调整
      min-width: calc((100% - 60px) / 4);
      max-width: calc((100% - 60px) / 4);
      text-align: center;
      .handle_list__item__icon-wrap {
        background-color: red;
        width: 100px;
        height: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        margin: 0 auto;
      }
      .handle_list_item__icon {
        margin-left: 5px;
      }
      .handle_list__item__text {
        font-size: 24px;
      }
    }
  }
}
